<template>
  <div>
    <div class="title">登入页面</div>
    <form class="mui-input-group">
      <div class="mui-input-row">
        <label>用户名</label>
        <input type="text" v-model="username" class="mui-input-clear" placeholder="请输入用户名" />
      </div>
      <div class="mui-input-row">
        <label>密码</label>
        <input type="password" v-model="password" class="mui-input-password" placeholder="请输入密码" />
      </div>
      <div class="mui-button-row">
        <button type="button" @click="logins" class="mui-btn mui-btn-primary">确认</button>
        <button type="button" class="mui-btn mui-btn-danger">取消</button>
      </div>
    </form>
  </div>
</template>

<script>
import { Toast } from 'mint-ui';
export default {
  name: "login",
  data() {
    return {
      username: "",
      password: ""
    };
  },
  methods: {
    logins() {
      if (this.username == "" || this.password == "") {
        Toast('有未输入的内容')
        return false;
      } else {
        this.$store.commit("setUser", 1);
        Toast('登入成功')
        this.$router.push("/");
      }
    }
  }
};
</script>

<style lang="scss" scoped>
.title {
  text-align: center;
}
</style>>